﻿<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>抽奖中心</title>

<link rel="stylesheet" href="<?php echo $image_url;?>files/choujiang/css/swiper.min.css">
<link rel="stylesheet" href="<?php echo $image_url;?>files/choujiang/css/common_mobile.css?version=1.0.0">
<link rel="stylesheet" href="<?php echo $image_url;?>files/choujiang/css/index.css?version=1.0.0">

<!-- 移动端适配 -->
<script>
	var html = document.querySelector('html');
	changeRem();
	window.addEventListener('resize', changeRem);

	function changeRem() {
		var width = html.getBoundingClientRect().width;
		html.style.fontSize = width / 10 + 'px';
	}
	var choujiang_count = <?php echo $userinfo['choujiang_count'] ?:0?>;
    var gailv = <?php echo json_encode( array_column($choujiangSetting,"gailv")) ?>;//抽奖概率
    var choujiang_setting = <?php echo json_encode( $choujiangSetting) ?>;
    var base_url="<?php echo $base_url;?>";
    var ticket_count = <?php echo $ticket_count?>;
</script>

<style>
.awards{top: 9.5rem;
    padding: 0.3rem;
    margin-left: -4.6rem;
    width: 9.2rem;
    background-color: #fd851f;
    box-shadow: 0 0.26666667rem 0.26666667rem rgba(248, 85, 40, 0.5) inset;
    border-radius: 0.13333333rem;
    box-sizing: border-box;}
.awards p{font-size:0.4rem; color:#340700; line-height:0.8rem;}
#wrap .title{width:100%; font-size:0.9rem; color:#fff; text-align:center; text-shadow:2px 2px 3px #fd9f04; position:absolute; left:0rem; top:2.5rem;}
</style>

</head>
<body>

<div id="wrap">
<!--    <p class="time">3.10-3.25</p>-->
    <div class="title">开房玩游戏    幸运大抽奖</div>
    <!--星星-->
    <div class="stars-box">
        <span class="stars"></span>
        <span class="stars"></span>
        <span class="stars"></span>
        <span class="stars"></span>
        <span class="stars"></span>
        <span class="stars"></span>
        <span class="stars"></span>
    </div>
    <!--主体-->
    <div class="main">
        <p class="rule"></p>
        <p class="nickname" style=" font-size: 0.5rem; position: absolute; top: 0.4rem; left: 45%; color: #e04000; font-weight: bold; text-shadow: 2px 2px 3px #ffffff;"><?php echo $userinfo['nickname']?></p>
<!--        <a href="../my.html" id="myWin">-->
<!--            <p class="my"></p>-->
<!--        </a>-->
        <!--游戏区域-->
        <div class="box">
            <span class="coin"></span>
            <h2>本月消耗房卡<span id=""><?php echo $choujiangMouthTicket['ticket_uses'] ? : 0 ?></span>张，剩余<span id="change"><?php echo $userinfo['choujiang_count'] ?:0?></span>次抽奖机会</h2>
            <ul class="light clearfix">
                <li class="fl">
                    <p></p>
                    <p class="blin"></p>
                    <p></p>
                    <p class="blin"></p>
                </li>
                <li class="fr">
                    <p class="blin"></p>
                    <p></p>
                    <p class="blin"></p>
                    <p></p>
                </li>
            </ul>
            <!--九宫格-->
            <ul class="play clearfix">
                <?php foreach ($choujiangSetting as $key=>$item) {?>
                    <li class="prize">
                        <div>
                            <p><?php echo $item["jiangpin"]?></p>
                        </div>
                    </li>
                    <?php if($key == 4){?>
                    <!--开始按钮-->
                    <li id="btn"></li>
                    <!--开始按钮-->
                    <?php }?>
                <?php } ?>
            </ul>
        </div>
        <!--奖品展示-->
        <div class="awards">
        	<p>1，每消耗20张房卡，当天可获得一次抽奖机会。如当日消耗62房卡 将获得3次抽奖机会，余下的2张不可累积到第二天，可在个人中心的“卡包记录”查询。</p>
            <p>2，此处的“消耗房卡”仅限开房游戏的消耗，不包含房卡发送及未开始的游戏房卡返还</p>
            <p>3，开房消耗获得的抽奖机会，月底将统一清零，不计入下月抽奖</p>
            <p>4，本游戏仅供娱乐，禁止赌博，抽奖获得的房卡为游戏道具，本平台不提供任何形式的回购，直接或变相兑换现金或实物等服务相关功能。</p>
            <!--<div class="swiper-container">
                <ul class="swiper-wrapper">
                    <li class="swiper-slide">
                        <img src="image/drag1.png">
                    </li>
                    <li class="swiper-slide">
                        <img src="image/drag2.png">
                    </li>
                    <li class="swiper-slide">
                        <img src="image/drag3.png">
                    </li>
                    <li class="swiper-slide">
                        <img src="image/drag4.png">
                    </li>
                    <li class="swiper-slide">
                        <img src="image/drag5.png">
                    </li>
                </ul>
            </div>-->
        </div>
    </div>
    <!--游戏规则弹窗-->
    <div id="mask-rule">
        <div class="box-rule">
            <span class="star"></span>
            <h2>我的抽奖记录</h2>
            <span id="close-rule"></span>
            <div class="con">
                <div class="text">
                    <?php foreach ($choujiang_journal as $item) { ?>
                    <p><?php echo date("Y-m-d H:i:s",$item['create_time']) ?> 抽中 <?php echo $item['ticket_count'] ?> 张房卡</p>
                    <?php  } ?>
                </div>
            </div>
        </div>
    </div>
    <!--中奖提示-->
    <div id="mask">
        <div class="blin"></div>
        <div class="caidai"></div>
        <div class="winning">
            <div class="red-head"></div>
            <div class="red-body"></div>
            <div id="card">
                <span  class="win">
                    <span class="textmessage" style="text-align: center; position: absolute; left: 0rem;top: 1.0rem; width: 100%; font-size: 0.7rem; "></span>
                </span>
            </div>
            <span class="btn"></span>
            <span id="close"></span>
        </div>
    </div>
</div>

<script src="<?php echo $image_url;?>files/choujiang/js/jquery.min.js"></script>
<script src="<?php echo $image_url;?>files/choujiang/js/swiper.jquery.min.js"></script>
<script src="<?php echo $image_url;?>files/choujiang/js/h5_game_common.js?version=1.0.0"></script>
<script src="<?php echo $image_url;?>files/choujiang/js/index.js?version=1.0.0"></script>

</body>
</html>